/**
 * @description  银行间持仓信息（回购指令）
 * @author shenhong
 */
import React, { PureComponent } from 'react';
import { connect } from 'dva';
import { Form } from '@ant-design/compatible';
import '@ant-design/compatible/assets/index.css';
import { message } from 'antd';
import { TableC, NoDataGrayC, NoDataMaskC } from '../../../../comps';
import _ from 'lodash';
@Form.create()
class PositionC extends PureComponent {
  constructor() {
    super();
    this.state = {
      isShow: false,
      posisionData: { columns: [], dataSource: [] },
      defaultColumns: [
        { key: 'pledgeBondCode', title: '质押券代码', dataIndex: 'pledgeBondCode' },
        { key: 'pledgeBondName', title: '质押券名称', dataIndex: 'pledgeBondName' },
        { key: 't0Number', title: 'T+0可用数量', dataIndex: 't0Number' },
        { key: 'expireDate', title: '到期日', dataIndex: 'expireDate' },
        { key: 'totalValue', title: '剩余票面总额', dataIndex: 'totalValue' },
        { key: 'externalRating', title: '外部评级', dataIndex: 'externalRating' },
        { key: 'paymentDate', title: '下一个付息日', dataIndex: 'paymentDate' },
      ],
      defaultDataSource: [
        {
          pledgeBondCode: '0000001',
          pledgeBondName: '华泰证券',
          t0Number: '100000000',
          expireDate: '2025-01-01',
          totalValue: '100000000',
          externalRating: 'AAA+',
          paymentDate: '2024-01-01',
        },
      ],
    };
  }
  componentDidMount() {
    this.props.onRef(this);
  }

  // 切换产品组合或托管机构时刷新表格数据
  UNSAFE_componentWillReceiveProps(nextProps) {
    const { portfolio, trustee, productGroupId } = nextProps;
    const { dispatch } = this.props;
    if ((portfolio !== undefined || productGroupId != undefined) && trustee !== undefined) {
      if (this.props.portfolio !== portfolio || this.props.trustee !== trustee || this.props.productGroupId !== productGroupId) {
        dispatch({
          type: 'interBankBasicInfoM/getPositionData',
          payload: {
            portfolio: portfolio ? portfolio : '',
            trustee: trustee,
            groupId: productGroupId ? productGroupId : '',
            currentPage: 1,
            numInPage: 9999,
          },
          callback: (res) => {
            if (res) {
              this.setState({ posisionData: res });
              this.props.onChange(res.dataSource); // 将持仓信息给传给父组件=>质押券
              this.listDatasource = _.cloneDeep(res.dataSource);
            } else {
              this.setState({ posisionData: { columns: [], dataSource: [] } });
              this.props.onChange([]); // 将持仓信息给传给父组件=>质押券
              this.listDatasource = [];
            }
          },
        });
        this.props.resetSearch();
      }
    }
  }

  // 重置持仓信息
  setPosition = () => {
    this.setState({ posisionData: { columns: [], dataSource: [] } });
  };

  //质押券点击事件
  addNewPledgeBond = (record) => {
    this.props.addNewPledgeBond(record);
  };

  // 更改columns的样式
  changeColumns = (columns) => {
    const arr = _.cloneDeep(columns);
    if (arr && arr.length) {
      arr.map((item) => {
        if (item.key == 'pledgeBondCode' && this.props.direct == '2') {
          item.render = (text, record) => {
            return (
              <span style={{ color: '#4D86FF', cursor: 'pointer ' }} onDoubleClick={() => this.addNewPledgeBond(record)}>
                {text}{' '}
              </span>
            );
          };
        }

        if (item.key == 't0Number') {
          item.type = 'number';
        }
        if (item.key == 'totalValue') {
          item.type = 'money';
        }
      });
    }
    return arr;
  };

  // 响应搜索
  searchPosition = (e) => {
    let newListDataSource = [];
    if (e == '' || e == null) {
      newListDataSource = this.listDatasource;
    } else {
      newListDataSource = this.listDatasource.filter((item) => {
        return item.pledgeBondCode.toString().includes(e) || item.pledgeBondName.toString().includes(e);
      });
    }
    this.setState({ posisionData: { columns: this.state.posisionData.columns, dataSource: newListDataSource } });
  };

  render() {
    const { type, loading, positionIsShow } = this.props;
    const { posisionData, defaultColumns, defaultDataSource } = this.state;
    const columns = positionIsShow ? defaultColumns : this.changeColumns(posisionData.columns);
    const dataSource = positionIsShow ? defaultDataSource : posisionData.dataSource;

    return (
      <div style={{ position: 'relative' }}>
        {
          <div style={{ marginTop: '10px' }}>
            <TableC columns={columns} dataSource={dataSource} hidePage={true} loading={loading.effects['interBankBasicInfoM/getPositionData']} scroll={{ x: 1300, y: 200 }} />
          </div>
        }
        {positionIsShow ? (
          <div>
            <NoDataMaskC height='100%' title={type == 12 ? '请选择产品组与托管机构，加载数据！' : '请选择组合与托管机构，加载数据！'} />
          </div>
        ) : null}
      </div>
    );
  }
}
export default connect(({ interBankBasicInfoM, loading }) => ({
  interBankBasicInfoM,
  loading,
}))(PositionC);
